<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">

<link href="__PCSS__head.css" rel="stylesheet" type="text/css">
<nav class="navbar">
    <div class="container-fluid col-md-12 row">

        <!--logo-->
        <div class="inline-block col-md-4">
            <img class="img-responsive"
                 src="http://opbk3tfrn.bkt.clouddn.com/v/logo.png">
        </div>

        <!--搜索栏-->
        <form class="col-md-4 inline-block" action="__MODULE__/Index/serach_page">
            <div class="input-group" style="margin-top: 5em;">
                <input type="text" class="form-control from-input" onblur="blu()" onkeyup="keyu()" id="head_serach" placeholder="Search for..." name="serData" autocomplete="off">
              <span class="input-group-btn" >
                <button type="submit" onclick="actionSerach()" class="btn btn-default from-input" style="background-color: #d58512;" type="button">
                    <span class="glyphicon glyphicon-search"></span>
                    搜索
                </button>
              </span>
            </div><!-- /input-group -->
            <ul class="col-md-12 serach-content dropdown-menu"></ul>
        </form>

        <!--记录与留言-->
        <div class="col-md-4 inline-block">

            <div style="margin-top: 5em;margin-left: 18em;">
                <!--<button type="button" class="btn btn-default">留言</button>-->
                <button type="button" class="btn btn-default" data-toggle="tooltip" data-placement="bottom" title="暂无观看记录！">记录</button>
            </div>

        </div>

    </div><!-- /.container-fluid -->
</nav>

<hr/>


<script type="text/javascript" src="__PJS__jquery-3.1.1.min.js"></script>
<script>
    var myLock = false;
    $('#head_serach').on('compositionstart',function(){
        myLock = true;
    });
    $('#head_serach').on('compositionend',function(){
        myLock = false;
    });

    function keyu(){
        $(function(){
            if(myLock)return false;
            var ser = $('#head_serach').val();
            if(ser==null||ser==''){
                return false;
            }

            $.ajax({
                'url':"__MODULE__/Index/serach",
                'data':{
                    serach:ser
                },
                'error': function(XMLHttpRequest, textStatus, errorThrown) {
                    alert(XMLHttpRequest.status);
                    alert(XMLHttpRequest.readyState);
                    alert(textStatus);
                },
                'success':function(res){
                    //alert(eval(res));
                    var obj = eval(res);
					console.log(obj);
                    $('.serach-content').html(null);
                    for(var i=0;i<obj.length;++i){
                        $('.serach-content').append('<li><a target="_blank" href="__MODULE__/index/lis/id/'+obj[i].id+'.html">'+obj[i].title+'</a></li>');
                    }
                }
            });
        });
        if($('#head_serach').val()!=""){
            $('.serach-content').show();
        }
    }

    function blu(){
     
		setTimeout(function(){
        //do blur save
			$('.serach-content').html(null);
			$('.serach-content').hide();
		}, 150);
    }
    function actionSerach(){

    }
</script>